<template>
  <div>
    <div class="addProtocol">
      <el-dialog
        title="查询"
        :visible.sync="searchDialogShow"
        class="box"
        :before-close="handleClose"
        :modal-append-to-body="false"
      >
        <div class="SearchDropDown">
          <el-dropdown style="cursor: pointer" @command="handleCommand" trigger="click">
                <span class="el-dropdown-link">{{this.intValue}}
                  <i class="el-icon-arrow-down el-icon--right"></i>
                </span>
            <el-dropdown-menu slot="dropdown">
              <el-dropdown-item command="基础查询">{{this.normalSearch}}</el-dropdown-item>
              <el-dropdown-item command="高级查询">{{this.higherSearch}}</el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
        </div>
        <div v-if="this.intValue === '基础查询'">
          <el-row>
            <el-col :span="3.5" style="text-align: left">
              <div class="grid-content bg-purple">
                出厂编号：
              </div>
            </el-col>
            <el-col :span="9">
              <div class="grid-content bg-purple">
                <input v-model="searchForm.equip_cid" class="LongInput" />
              </div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="3.5" style="text-align: left">
              <div class="grid-content bg-purple">
                厂内编号：
              </div>
            </el-col>
            <el-col :span="9">
              <div class="grid-content bg-purple">
                <input v-model="searchForm.produce_number" class="LongInput"/>
              </div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="3.5" style="text-align: left">
              <div class="grid-content bg-purple">
                设备名称：
              </div>
            </el-col>
            <el-col :span="9">
              <div class="grid-content bg-purple">
                <el-select @change="getSelectLabel(searchForm.name, 'name')" clearable class="LongSelectInput" v-model="searchForm.name" placeholder="请选择">
                  <el-option
                    v-for="item in nameOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              </div>
            </el-col>
          </el-row>
          <el-row v-show="false">
            <el-col :span="3.5" style="display: inline-block; width: 70px; text-align: left">
              <div class="grid-content bg-purple">
                状态：
              </div>
            </el-col>
            <el-col :span="9">
              <div class="grid-content bg-purple">
                <el-select @change="getSelectLabel(searchForm.name, 'status')" clearable class="LongSelectInput" v-model="searchForm.equip_status" placeholder="请选择">
                  <el-option
                    v-for="item in statusOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              </div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="3.5" style="text-align: left">
              <div class="grid-content bg-purple">
                设备型号：
              </div>
            </el-col>
            <el-col :span="9">
              <div class="grid-content bg-purple">
                <input v-model="searchForm.model" class="LongInput"/>
              </div>
            </el-col>
          </el-row>
        </div>
        <div  v-if="this.intValue === '高级查询'">
          <el-row>
            <el-col :span="2" style="text-align: left">
              <div class="grid-content bg-purple">
                出厂编号：
              </div>
            </el-col>
            <el-col :span="10">
              <div class="grid-content bg-purple">
                <input v-model="higherSearchForm.equip_cid" class="normalInput"/>
              </div>
            </el-col>
            <el-col :span="2" style="text-align: left" v-show="false">
              <div class="grid-content bg-purple" >
                状态：
              </div>
            </el-col>
            <el-col :span="10" v-show="false">
              <div class="grid-content bg-purple">
                <el-select clearable class="normalSelectInput" v-model="higherSearchForm.equip_status"  placeholder="请选择">
                  <el-option
                    v-for="item in statusOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              </div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="2">
              <div class="grid-content bg-purple-light" style="text-align: left">
                设备名称：
              </div>
            </el-col>
            <el-col :span="10">
              <div class="grid-content bg-purple-light">
                <el-select @change="getSelectLabel(higherSearchForm.name, 'name')" clearable class="normalSelectInput" v-model="higherSearchForm.name"  placeholder="请选择">
                  <el-option
                    v-for="item in nameOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              </div>
            </el-col>
            <el-col :span="2">
              <div class="grid-content bg-purple-light" style="text-align: left">
                型号：
              </div>
            </el-col>
            <el-col :span="10">
              <div class="grid-content bg-purple-light">
                <input v-model="higherSearchForm.model" class="normalInput"/>
              </div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="2" style="text-align: left">
              <div class="grid-content bg-purple" >
                类型：
              </div>
            </el-col>
            <el-col :span="10">
              <div class="grid-content bg-purple">
                <el-select @change="getSelectLabel(higherSearchForm.type, 'type')" clearable class="normalSelectInput" v-model="higherSearchForm.type" placeholder="请选择">
                  <el-option
                    v-for="item in typeOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              </div>
            </el-col>
            <el-col :span="2">
              <div class="grid-content bg-purple-light" style="text-align: left">
                品牌：
              </div>
            </el-col>
            <el-col :span="10">
              <div class="grid-content bg-purple-light">
                <el-select @change="getSelectLabel(higherSearchForm.brand, 'brand')" clearable class="normalSelectInput" v-model="higherSearchForm.brand" placeholder="请选择">
                  <el-option
                    v-for="item in brandOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              </div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="2" style="text-align: left">
              <div class="grid-content bg-purple">
                操作方式：
              </div>
            </el-col>
            <el-col :span="10">
              <div class="grid-content bg-purple">
                <el-select @change="getSelectLabel(higherSearchForm.operation_mode, 'operation')" clearable class="normalSelectInput" v-model="higherSearchForm.operation_mode" placeholder="请选择">
                  <el-option
                    v-for="item in operationModeOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              </div>
            </el-col>
            <el-col :span="2">
              <div class="grid-content bg-purple-light" style="text-align: left">
                工作级别：
              </div>
            </el-col>
            <el-col :span="10">
              <div class="grid-content bg-purple-light">
                <el-select @change="getSelectLabel(higherSearchForm.work_level, 'work')" clearable class="normalSelectInput" v-model="higherSearchForm.work_level" placeholder="请选择">
                  <el-option
                    v-for="item in workLevelOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              </div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="2" style="text-align: left">
              <div class="grid-content bg-purple">
                额定重量：
              </div>
            </el-col>
            <el-col :span="10">
              <div class="grid-content bg-purple">
                <el-select @change="getSelectLabel(higherSearchForm.rated_weight_type, 'ratedWeight')" clearable class="shortSelectInput" v-model="higherSearchForm.rated_weight_type" placeholder="请选择">
                  <el-option
                    v-for="item in options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select> <input v-model="higherSearchForm.rated_weight" class="unnormalInput"/>
              </div>
            </el-col>
            <el-col :span="2">
              <div class="grid-content bg-purple-light" style="text-align: left">
                跨度：
              </div>
            </el-col>
            <el-col :span="10">
              <div class="grid-content bg-purple-light">
                <el-select @change="getSelectLabel(higherSearchForm.span_type, 'span')" clearable class="shortSelectInput" v-model="higherSearchForm.span_type" placeholder="请选择">
                  <el-option
                    v-for="item in options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select> <input v-model="higherSearchForm.span" class="unnormalInput"/>
              </div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="2" style="text-align: left">
              <div class="grid-content bg-purple">
                轨道长度：
              </div>
            </el-col>
            <el-col :span="10">
              <div class="grid-content bg-purple">
                <el-select @change="getSelectLabel(higherSearchForm.big_car_track_length_type, 'bigTrackLength')" clearable class="shortSelectInput" v-model="higherSearchForm.big_car_track_length_type" placeholder="请选择">
                  <el-option
                    v-for="item in options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select> <input v-model="higherSearchForm.big_car_track_length" class="unnormalInput"/>
              </div>
            </el-col>
            <el-col :span="2">
              <div class="grid-content bg-purple-light" style="text-align: left">
                额定功率：
              </div>
            </el-col>
            <el-col :span="10">
              <div class="grid-content bg-purple-light">
                <el-select @change="getSelectLabel(higherSearchForm.whole_rated_power_type, 'ratedPower')" clearable class="shortSelectInput" v-model="higherSearchForm.whole_rated_power_type"  placeholder="请选择">
                  <el-option
                    v-for="item in options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select> <input v-model="higherSearchForm.whole_rated_power" class="unnormalInput"/>
              </div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="2" style="text-align: left">
              <div class="grid-content bg-purple">
                起升高度：
              </div>
            </el-col>
            <el-col :span="10">
              <div class="grid-content bg-purple">
                <el-select @change="getSelectLabel(higherSearchForm.lifting_height_type, 'liftingHeight')" clearable class="shortSelectInput" v-model="higherSearchForm.lifting_height_type" placeholder="请选择">
                  <el-option
                    v-for="item in options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select> <input v-model="higherSearchForm.lifting_height" class="unnormalInput"/>
              </div>
            </el-col>
            <el-col :span="2">
              <div class="grid-content bg-purple-light" style="text-align: left">
                轨道型号：
              </div>
            </el-col>
            <el-col :span="10">
              <div class="grid-content bg-purple-light">
                <input v-model="higherSearchForm.big_car_track_model" maxlength="32" class="normalInput"/>
              </div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="2" style="text-align: left">
              <div class="grid-content bg-purple">
                出厂时间：
              </div>
            </el-col>
            <el-col :span="10">
              <div class="grid-content bg-purple">
                <el-date-picker
                  class="normalInput"
                  v-model="produce_date"
                  type="daterange"
                  align="right"
                  @blur="produceValue"
                  format="yyyy 年 MM 月 dd 日"
                  value-format="yyyy-MM-dd"
                  unlink-panels
                  range-separator="至"
                  start-placeholder="开始日期"
                  end-placeholder="结束日期">
                </el-date-picker>
              </div>
            </el-col>
            <el-col :span="2">
              <div class="grid-content bg-purple-light" style="text-align: left">
                服务时间：
              </div>
            </el-col>
            <el-col :span="10">
              <div class="grid-content bg-purple-light">
                <el-date-picker
                  class="normalInput"
                  v-model="delivery_time"
                  type="daterange"
                  align="right"
                  @blur="deliveryValue"
                  format="yyyy 年 MM 月 dd 日"
                  value-format="yyyy-MM-dd"
                  unlink-panels
                  range-separator="至"
                  start-placeholder="开始日期"
                  end-placeholder="结束日期">
                </el-date-picker>
              </div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="2" style="text-align: left">
              <div class="grid-content bg-purple">
                年审时间：
              </div>
            </el-col>
            <el-col :span="10">
              <div class="grid-content bg-purple">
                <el-date-picker
                  class="normalInput"
                  v-model="next_annual_trial"
                  type="daterange"
                  @blur="trialValue"
                  align="right"
                  format="yyyy 年 MM 月 dd 日"
                  value-format="yyyy-MM-dd"
                  unlink-panels
                  range-separator="至"
                  start-placeholder="开始日期"
                  end-placeholder="结束日期">
                </el-date-picker>
              </div>
            </el-col>
            <el-col :span="2">
              <div class="grid-content bg-purple-light" style="text-align: left">
                安装地址：
              </div>
            </el-col>
            <el-col :span="10">
              <div class="grid-content bg-purple-light">
                <input v-model="higherSearchForm.install_position" class="normalInput"/>
              </div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="2" style="text-align: left">
              <div class="grid-content bg-purple">
                客户名称：
              </div>
            </el-col>
            <el-col :span="10">
              <div class="grid-content bg-purple">
                <input v-model="higherSearchForm.customer_name" class="normalInput"/>
              </div>
            </el-col>
            <el-col :span="2">
              <div class="grid-content bg-purple-light" style="text-align: left">
                所属车间：
              </div>
            </el-col>
            <el-col :span="10">
              <div class="grid-content bg-purple-light">
                <input v-model="higherSearchForm.workshop" class="normalInput"/>
              </div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="2" style="text-align: left">
              <div class="grid-content bg-purple">
                制造商：
              </div>
            </el-col>
            <el-col :span="10">
              <div class="grid-content bg-purple">
                <input v-model="higherSearchForm.manufacturer" class="normalInput"/>
              </div>
            </el-col>
            <el-col :span="2">
              <div class="grid-content bg-purple-light" style="text-align: left">
                行业类别：
              </div>
            </el-col>
            <el-col :span="10">
              <div class="grid-content bg-purple-light">
                <el-select @change="getSelectLabel(higherSearchForm.industry_type, 'industryType')" clearable class="normalSelectInput" v-model="higherSearchForm.industry_type" placeholder="请选择">
                  <el-option
                    v-for="item in industryTypeOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              </div>
            </el-col>
          </el-row>
        </div>
        <div slot="footer" class="dialog-footer clearFix">
          <!--<div class="footerLeft" v-if="this.intValue === '高级查询'">-->
            <!--<input class="unnormalInput" placeholder="查询标签名称，最多10个字"/>-->
            <!--<button>创建快捷查询标签</button>-->
            <!--<span>创建标签后，您可以快速进行列表信息筛选！</span>-->
          <!--</div>-->
          <div class="footerRightBtn">
            <el-button v-if="this.intValue === '基础查询'" type="primary" @click="confirmSearch()">查 询</el-button>
            <el-button v-if="this.intValue === '高级查询'" type="primary" @click="higherConfirmSearch()">查 询</el-button>
            <el-button type="info" @click="dataReset">重 置</el-button>
          </div>
        </div>
      </el-dialog>
    </div>
  </div>
</template>

<script>
  import axios from 'axios'
  import BUS from './../equipBus'
  export default {
    data() {
      return {
        options: [{
          value: '1',
          label: '大于'
        }, {
          value: '2',
          label: '小于'
        }, {
          value: '3',
          label: '等于'
        }],
        value: '',
        // 基础查询数据
        searchForm: {
          equip_cid: '',
          produce_number: '',
          name: '',
          equip_status: '',
          model: ''
        },
        // 高级查询数据
        higherSearchForm: {
          equip_cid: '',
          produce_number: '',
          name: '',
          equip_status: '',
          model: '',
          type: '',
          brand: '',
          operation_mode: '',
          work_level: '',
          rated_weight_type: '',
          rated_weight: '',
          span_type: '',
          span: '',
          big_car_track_length_type: '',
          big_car_track_length: '',
          whole_rated_power_type: '',
          whole_rated_power: '',
          lifting_height_type: '',
          lifting_height: '',
          big_car_track_model: '',
          produce_date_begin: '',
          produce_date_end: '',
          delivery_time_begin: '',
          delivery_time_end: '',
          next_annual_trial_begin: '',
          next_annual_trial_end: '',
          install_position: '',
          customer_name: '',
          workshop: '',
          manufacturer: '',
          industry_type: ''
        },
        // 时间
        next_annual_trial: '',
        delivery_time: '',
        produce_date: '',
        // 下拉选择
        statusOptions: [],
        nameOptions: [],
        brandOptions: [],
        operationModeOptions: [],
        workLevelOptions: [],
        typeOptions: [],
        industryTypeOptions: [],
        dialogBack: false,
        formLabelWidth: '85px',
        // 下拉选项
        intValue: '基础查询',
        normalSearch: '基础查询',
        higherSearch: '高级查询',
        // 以下为接口
        // 获取起重机名称
        nameselectTable: {
          access_token: localStorage.getItem('access_token'),
          type: 'equip_get_crane_name'
        },
        // 获取起重机品牌
        brandselectTable: {
          access_token: localStorage.getItem('access_token'),
          type: 'equip_get_crane_brand'
        },
        // 获取操作方式
        operationmodeselectTable: {
          access_token: localStorage.getItem('access_token'),
          type: 'equip_get_operation_mode'
        },
        // 获取工作级别
        worklevelselectTable: {
          access_token: localStorage.getItem('access_token'),
          type: 'equip_get_work_level'
        },
        // 获取类型
        typeselectTable: {
          access_token: localStorage.getItem('access_token'),
          type: 'equip_get_crane_type'
        },
        // 获取行业类别
        industrytypeselectTable: {
          access_token: localStorage.getItem('access_token'),
          type: 'equip_get_industry_type'
        },
        // 获取起重机状态
        statusselectTable: {
          access_token: localStorage.getItem('access_token'),
          type: 'equip_get_crane_status'
        }
      }
    },
    created() {
      this.searchDialogShow = true
    },
    mounted() {
      this.stausselect()
      this.nameselect()
      this.brandselect()
      this.operationmodeselect()
      this.worklevelselect()
      this.industrytypeselect()
      // 综合接收
      //      BUS.$on('synReturn', (synSearch) => {
      //        console.log(synSearch)
      //        console.log(this.searchForm)
      //        console.log(JSON.stringify(synSearch))
      //        this.searchForm = synSearch
      //        if (JSON.stringify(synSearch) !== {}) {
      //          this.searchForm = synSearch
      //          // this.synFormTest()
      //        }
      //        this.searchForm = Object.assign({}, this.searchForm)
      //        // console.log(this.searchForm)
      //        this.synFormTest()
      //      })
      //      BUS.$on('synHighReturn', (synSearchData) => {
      //        console.log(synSearchData)
      //        console.log(JSON.stringify(synSearchData))
      //        if (JSON.stringify(synSearchData) !== {}) {
      //          this.higherSearchForm = synSearchData
      //        }
      //      })
    },
    methods: {
      // 获取select值
      getSelectLabel(value, From) {
        console.log(value, From)
        let oVal = value
        let oFrom = From
        let obj = {}
        // 设备名称
        if (oFrom === 'name') {
          if (oVal !== '') {
            obj = this.nameOptions.find((item) => {
              return item.value === oVal
            })
            console.log(obj.label)
            window.sessionStorage.setItem('synNameSelectLabel', obj.label)
          }
        }
        // 设备类型
        if (oFrom === 'type') {
          if (oVal !== '') {
            obj = this.typeOptions.find((item) => {
              return item.value === oVal
            })
            console.log(obj.label)
            window.sessionStorage.setItem('synTypeSelectLabel', obj.label)
          }
        }
        // 设备品牌
        if (oFrom === 'brand') {
          if (oVal !== '') {
            obj = this.brandOptions.find((item) => {
              return item.value === oVal
            })
            console.log(obj.label)
            window.sessionStorage.setItem('synBrandSelectLabel', obj.label)
          }
        }
        // 操作方式
        if (oFrom === 'operation') {
          if (oVal !== '') {
            obj = this.operationModeOptions.find((item) => {
              return item.value === oVal
            })
            console.log(obj.label)
            window.sessionStorage.setItem('synModeSelectLabel', obj.label)
          }
        }
        // 工作级别
        if (oFrom === 'work') {
          if (oVal !== '') {
            obj = this.workLevelOptions.find((item) => {
              return item.value === oVal
            })
            console.log(obj.label)
            window.sessionStorage.setItem('synWorkSelectLabel', obj.label)
          }
        }
        // 额定重量
        if (oFrom === 'ratedWeight') {
          if (oVal !== '') {
            obj = this.options.find((item) => {
              return item.value === oVal
            })
            console.log(obj.label)
            window.sessionStorage.setItem('synRatedWeightSelectLabel', obj.label)
          }
        }
        // 跨度
        if (oFrom === 'span') {
          if (oVal !== '') {
            obj = this.options.find((item) => {
              return item.value === oVal
            })
            console.log(obj.label)
            window.sessionStorage.setItem('synSpanSelectLabel', obj.label)
          }
        }
        // 轨道长度
        if (oFrom === 'bigTrackLength') {
          if (oVal !== '') {
            obj = this.options.find((item) => {
              return item.value === oVal
            })
            console.log(obj.label)
            window.sessionStorage.setItem('synTrackLengthSelectLabel', obj.label)
          }
        }
        // 额定功率
        if (oFrom === 'ratedPower') {
          if (oVal !== '') {
            obj = this.options.find((item) => {
              return item.value === oVal
            })
            console.log(obj.label)
            window.sessionStorage.setItem('synRatedPowerSelectLabel', obj.label)
          }
        }
        // 起升高度
        if (oFrom === 'liftingHeight') {
          if (oVal !== '') {
            obj = this.options.find((item) => {
              return item.value === oVal
            })
            console.log(obj.label)
            window.sessionStorage.setItem('synLiftingHeightSelectLabel', obj.label)
          }
        }
        // 行业类别
        if (oFrom === 'industryType') {
          if (oVal !== '') {
            obj = this.industryTypeOptions.find((item) => {
              return item.value === oVal
            })
            console.log(obj.label)
            window.sessionStorage.setItem('synIndustryTypeSelectLabel', obj.label)
          }
        }
      },
      // 重置
      dataReset() {
        this.searchForm = {}
        this.higherSearchForm = {}
        this.next_annual_trial = ''
        this.delivery_time = ''
        this.produce_date = ''
        BUS.$emit('synReset', 1)
        this.handleClose()
      },
      //       test
      //       synFormTest() {},
      //       dsd
      // 查询时间获取
      produceValue() {
        console.log(this.produce_date)
        if (this.produce_date !== null) {
          let produce_begin = this.produce_date[0]
          let produce_end = this.produce_date[1]
          this.higherSearchForm.produce_date_begin = produce_begin
          this.higherSearchForm.produce_date_end = produce_begin
          console.log(produce_begin)
          console.log(produce_end)
        }
      },
      deliveryValue() {
        console.log(this.delivery_time)
        if (this.delivery_time !== null) {
          let delivery_begin = this.delivery_time[0]
          let delivery_end = this.delivery_time[1]
          this.higherSearchForm.delivery_time_begin = delivery_begin
          this.higherSearchForm.delivery_time_end = delivery_end
          console.log(delivery_begin)
          console.log(delivery_end)
        }
      },
      trialValue() {
        console.log(this.next_annual_trial)
        if (this.next_annual_trial !== null) {
          let trial_begin = this.next_annual_trial[0]
          let trial_end = this.next_annual_trial[1]
          this.higherSearchForm.next_annual_trial_begin = trial_begin
          this.higherSearchForm.next_annual_trial_end = trial_end
          console.log(trial_begin)
          console.log(trial_end)
        }
      },
      // 添加类名切换样式
      handleCommand(val) {
        console.log(val)
        this.intValue = val
        if (val === '高级查询') {
          document.querySelector('.box').classList.add('longWidth')
        } else {
          document.querySelector('.box').classList.remove('longWidth')
        }
      },
      // 子组件传值
      handleClose() {
        const dialogShow = this.dialogBack // 所需要传的值
        this.$emit('giveFalse', dialogShow) // 传值的参数
      },
      confirmSearch() {
        BUS.$emit('synSearch', this.searchForm)
        this.handleClose()
      },
      higherConfirmSearch() {
        BUS.$emit('synHigher', this.higherSearchForm)
        this.handleClose()
      },
      // 以下为获取数据方法
      // 获取起重机名称
      nameselect() {
        axios.post('/basicdata', this.nameselectTable, {
          headers: {
            'Content-Type': 'application/x-www-form-urlencoded'
          }
        }).then((res) => {
          this.nameOptions = res.data.datas
          console.log(res.data.datas)
        })
          .catch(function(error) {
            console.log(error)
          })
      },
      // 获取起重机品牌
      brandselect() {
        axios.post('/basicdata', this.brandselectTable, {
          headers: {
            'Content-Type': 'application/x-www-form-urlencoded'
          }
        }).then((res) => {
          this.brandOptions = res.data.datas
        })
          .catch(function(error) {
            console.log(error)
          })
      },
      // 获取操作方式
      operationmodeselect() {
        axios.post('/basicdata', this.operationmodeselectTable, {
          headers: {
            'Content-Type': 'application/x-www-form-urlencoded'
          }
        }).then((res) => {
          this.operationModeOptions = res.data.datas
        })
          .catch(function(error) {
            console.log(error)
          })
      },
      // 获取工作级别
      worklevelselect() {
        axios.post('/basicdata', this.worklevelselectTable, {
          headers: {
            'Content-Type': 'application/x-www-form-urlencoded'
          }
        }).then((res) => {
          this.workLevelOptions = res.data.datas
        })
          .catch(function(error) {
            console.log(error)
          })
      },
      // 获取工作级别
      worklevelselect() {
        axios.post('/basicdata', this.typeselectTable, {
          headers: {
            'Content-Type': 'application/x-www-form-urlencoded'
          }
        }).then((res) => {
          this.typeOptions = res.data.datas
        })
          .catch(function(error) {
            console.log(error)
          })
      },
      // 获取行业类别
      industrytypeselect() {
        axios.post('/basicdata', this.industrytypeselectTable, {
          headers: {
            'Content-Type': 'application/x-www-form-urlencoded'
          }
        }).then((res) => {
          this.industryTypeOptions = res.data.datas
        })
          .catch(function(error) {
            console.log(error)
          })
      },
      // 获取起重机状态
      stausselect() {
        axios.post('/basicdata', this.statusselectTable, {
          headers: {
            'Content-Type': 'application/x-www-form-urlencoded'
          }
        }).then((res) => {
          this.statusOptions = res.data.datas
          console.log(res.data.datas)
        })
          .catch(function(error) {
            console.log(error)
          })
      }
    }
  }
</script>

<style scoped>
  /*****************第一层弹窗*****************/
  .clearFix:after{
    display: block;
    content: '';
    clear: both;
  }
  .box {
    background: rgba(0,0,0,0.5);
  }
  /deep/ .box > .el-dialog{
    width: 0;
    min-width: 540px !important;
    min-height: 266px;
    margin-top: 30vh !important;
    border-radius: 4px;
  }
  /deep/ .longWidth > .el-dialog{
    width: 0;
    min-width: 1050px !important;
    min-height: 340px;
    margin-top: 26vh !important;
    border-radius: 4px;
  }
  /deep/ .el-dialog__footer{
    padding: 0 10px 10px 0;
    padding-top: 0;
  }
  /*****************输入框*****************/
  .typeInput{
    width: 425px;
    height: 25px;
    border-radius: 4px;
    border: 1px solid #ccc;
    outline: none;
    text-indent: 10px;
  }
  .disableInput{
    border: none;
    background-color: #fff;
  }
  input::-webkit-input-placeholder{
    color: #C0C4CC;
  }
  /*****************第一层弹窗头部*****************/
  /deep/ .box > .el-dialog > .el-dialog__header{
    min-width: 540px;
    height: 39px;
    line-height: 43px;
    padding: 0;
    text-indent: 20px;
    font-weight: bolder;
    border-radius: 4px 4px 0 0;
    background-color: #e3e6ee;
  }
  /deep/ .box > .el-dialog > .el-dialog__header > .el-dialog__headerbtn{
    top: 12px;
  }
  /deep/ .box > .el-dialog > .el-dialog__header > .el-dialog__headerbtn > i{
    font-size: 18px;
    font-weight: bolder;
  }
  /*****************第一层弹窗内容*****************/
  /deep/ .box > .el-dialog > .el-dialog__body{
    padding: 0 0 0 10px ;
    margin-top: 15px;
  }
  /deep/ .box > .el-dialog > .el-dialog__body > .el-form > .el-form-item{
    margin-bottom: 0px;
  }
  /deep/ .box > .el-dialog > .el-dialog__body > .el-form > .el-form-item > .el-form-item__label{
    color: #69727E;
    padding: 0;
    font-weight: normal;
  }
  /deep/ .box > .el-dialog > .el-dialog__body > .el-form > .el-form-item > .el-form-item__content > .el-input > .el-input__inner{
    width: 240px;
    height: 30px;
    padding: 0 5px;
  }
  /deep/ .box > .el-dialog > .el-dialog__body > .el-form > .borderNone > .el-form-item__content > .el-input > .el-input__inner{
    border: none;
  }
  /*****************第一层弹窗底部*****************/
  /deep/ .box > .el-dialog > .el-dialog__footer{
    border-top: 1px solid #e3e6ee;
  }
  /*****************底部按钮*****************/
  /deep/ .dialog-footer{
    padding-top: 8px;
  }
  .footerLeft{
    padding-left: 10px;
    float: left;
  }
  .footerLeft > button{
    position: relative;
    left: -10px;
    top: -1px;
    height: 24px;
    border-radius: 4px;
    background-color: #47af41;
    color: #fff;
    font-size: 14px;
    cursor: pointer;
    outline: none;
    border: none;
  }
  .footerLeft > span{
    margin-left: -10px;
    font-size: 12px;
    color: #47af41;
  }
  .footerRightBtn{
    float: right;
  }
  /deep/ .dialog-footer > .footerRightBtn > .el-button{
    width: 80px;
    height: 30px;
    padding: 0;
  }
  /******************切换查询模式*****************/
  .SearchDropDown {
    padding-bottom: 18px;
  }
  /deep/ .el-dropdown {
    background-color: #0072F3;
    color: #fff;
    border-radius: 4px;
  }
  /deep/ .el-dropdown > .el-dropdown-link{
    padding: 0 5px;
  }
  /****************输入框input样式****************/
  .el-row {
    padding-bottom: 6px;
  }
  .LongInput{
    width: 428px;
    height: 24px;
    padding: 0 6px;
    outline: none;
    border-radius: 4px;
    border: 1px solid #dcdfe6;
  }
  .normalInput {
    width: 410px;
    height: 24px;
    padding: 0 6px;
    outline: none;
    border-radius: 4px;
    border: 1px solid #dcdfe6;
  }
  .unnormalInput {
    width: 330px;
    height: 24px;
    padding: 0 6px;
    outline: none;
    border-radius: 4px;
    border: 1px solid #dcdfe6;
  }
  /deep/ .LongSelectInput > .el-input > .el-input__inner {
    width: 428px;
    height: 24px;
    padding: 0 6px;
  }
  /deep/ .normalSelectInput > .el-input > .el-input__inner {
    width: 410px;
    height: 24px;
    padding: 0 6px;
  }
  /deep/ .shortSelectInput > .el-input > .el-input__inner {
    width: 76px;
    height: 24px;
    padding: 0 6px;
  }
  /***日期Input***/
  /deep/ .el-date-editor .el-range-separator{
    height: 24px;
    line-height: 24px;
  }
  /deep/ .el-date-editor .el-range__icon{
    line-height: 24px;
  }
  /deep/ .el-date-editor .el-range__close-icon{
    line-height: 24px;
  }
</style>
